<!DOCTYPE html>
<html>
    <head>
        <title>LUI组件库</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <meta name="apple-mobile-web-app-status-bar-style" content="black" />
        <meta name="format-detection" content="telephone=no" />
        <meta http-equiv="Cache-Control" content="no-cache">
        <meta http-equiv="Pragma" content="no-cache">
        <meta name="keywords" content="LUI，轻量级移动端UI组件库" />
        <meta name="description" content="LUI，基于html,css,js原生能力驱动，轻量级移动端UI组件库。LUI不是框架，她只是为你的应用提供基础的UI组合以及一些常用方法，架构层面随你自行组织" />
        <link rel="icon" href="images/icon/lui.png">        
        <link rel="stylesheet" type="text/css" href="css/lui.css" />
    
  <script type="text/javascript" src="js/demo.js"></script>
</head>
    <body>
      <div class="ui_page_wrap">
        <header class="ui_page_hd"><a href="javascript:goBack();" class="ui_back"></a>签名</header>
        <div class="ui_page_bd">
          <div class="ui_con_block">
            <p>
              canvas技术实现。
            </p>
          </div>
          <!-- /// [htmldemo] -->
          <div id="j_canvas_wrap">
            <canvas id="j_canvas">浏览器不支持canvas</canvas>
            <div class="tr p15">
              <button type="button" class="ui_btn ui_default_btn ui_inline mr10" size="sm" id="j_reset" onclick="reset()">重签</button>
              <button type="button" class="ui_btn ui_inline" size="sm" id="j_save" onclick="getBase64Sign()">确认</button>
            </div>
          </div>
          <!-- /// [htmldemo] -->
        </div>
      </div>
      
    <script type="text/javascript" src="js/lui.js"></script>
    <!--签名的js-->
    <script type="text/javascript" src="js/lib/signature.js"></script>
    <script type="text/javascript">
        ///[jsdemo]
        //签名
        var _dataImg = null
        var signature = new Signature({
          callback:function(dataImg){
            _dataImg = dataImg
          }
        });
        function reset(){
          signature.clearRect()
        }
        //取得签名图片
        function getBase64Sign(){
            lui.showModal({
              content:'<img src="'+ _dataImg+'">'
            });
        }
        ///[jsdemo]
    </script>
    </body>
</html>